<template>
    <div>
        <div class="crumbs">
            <el-form ref="form" :model="form" label-width="130px">
               <div class="container" style="position: relative;">
				   <div class="left">


					   <el-checkbox-group
					       v-model="sendList"
						   style="margin: 30px 0px 0px 30px;height:500px;overflow: hidden;overflow-y: auto;"
					      >
					       <el-checkbox v-for="item in companyList" :label="item" :key="item.id" style="display: block;height:30px;">{{item.abbreviation}}</el-checkbox>
					     </el-checkbox-group>
				   </div>

				   <div class="right">
					    <el-input v-model="submitList.title" placeholder="请输入标题,最多16个字" class="handle-input mr10" maxlength="16"></el-input>
						<textarea  name="" id="" cols="100" rows="10" style="margin-top:30px;" placeholder="请输入消息,最多50个字" v-model="submitList.content" maxlength="50"></textarea>

				   </div>
			   </div>

			   <el-form-item class="footerFixed">
			       <el-button type="primary" v-preventReClick = "5000" @click="save">提交</el-button>
			       <el-button @click="backPage">返回</el-button>
			   </el-form-item>

            </el-form>
        </div>
    </div>
</template>

<script>
import axios from "axios"
import { app_listall_customapp,getCompanyByCustomAppId,messageSave,messagefindById } from '@/request/api';
export default {
    data() {
        return {
			headImg:'',
			sendList:[],
			form:{},
            logoImg: '',
            imageUrl: '',
			list:[],
			xtList:"",
			companyList:[],
			sendNameList:[],
			namelist:[],
		    submitList:{
				title:"",
				content:"",
				appName:'普惠金融'
			},
			id:''
        };
    },
    mounted() {
		this.id = this.$route.query.id


		this.init();


    },
    methods: {


		init(){
			var companyid = localStorage.getItem("companyId")
			axios.get("https://bbgy.cpzsyun.com:82/api/usercenter/company/bankAndConpany/"+companyid).then(res=>{
				// console.
				this.companyList = res.data
			})

		},




        backPage() {
            this.$router.go(-1);
        },

        save() {
			if(this.sendList.length == 0){
				this.$notify({
					title: '提示',
					message: '投放公司不能为空',
					type: 'info',
					duration: 1000
				});
				return false
			}
			if(this.submitList.title.length == 0){
				this.$notify({
					title: '提示',
					message: '标题不能为空',
					type: 'info',
					duration: 1000
				});
				return false
			}

				if(this.submitList.content.length == 0){
					this.$notify({
						title: '提示',
						message: '消息内容不能为空',
						type: 'info',
						duration: 1000
					});
					return false
				}
				this.sendNameList = []

				var lslist = []
				for(var r = 0; r < this.sendList.length; r++){
					lslist.push({companyName:this.sendList[r].abbreviation,companyId:this.sendList[r].id})
				}
			this.submitList.companyIdList = lslist


			let data = this.submitList
			axios.post("https://bbgy.cpzsyun.com:82/api/control/message/save",data).then((res)=>{
				this.$notify({
						title: '提示',
						message: '新增成功',
						type: 'success',
						duration: 1000
					});
					this.backPage()
			})

        }
    }
};
</script>

<style scoped>
.left{
	height:600px;
	width:400px;
	display: inline-block;
	/* border: 1px solid #000000; */
}
.right{
	height:600px;
	width:400px;
	display: inline-block;
	position: absolute;
	top:40px;
	left:480px;

}
.crumbs {
    width: 95%;
    margin: 0 auto;
    margin-top: 30px;
    background: #ffffff;
}

.lu {
    width: 8px;
    height: 16px;
    background: greenyellow;
}
.hnk {
    display: inline-block;
}
.jgxx {
    margin-left: 10px;
    font-weight: 600;
    font-size: 15px;
}
.jgcontainer {
    font-weight: 400;
}
.con {
    width: 40%;
    padding: 20px;
    font-size: 14px;
    margin-left: 20px;
}
.handle-input {
    width: 300px;
    display: inline-block;
    /* margin-left: 30px; */
}

.avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    width: 180px;
    overflow: hidden;
}

.avatar-uploader .el-upload:hover {
    border-color: #409EFF;
}
.el-upload--text {
    width: 180px;
}
.avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
}
.avatar {
    width: 178px;
    height: 178px;
    display: block;
}
</style>
